import React, { Component } from "react";
import { withRouter } from "react-router-dom";
import { Carousel, WhiteSpace } from "weaver-mobile";
import "../index.less";

// images: ["/images/detail2.png"],
// title: "中田集团 |未来您身边的综合性生活服务供应商",
// startDate: "2021年04月27日",
// startTime: "10:30",
// endDate: "2021年04月27日",
// endTime: "11:30",
// duration: "1小时",
// status: "已开始",
// address: "上海市黄浦区小东门街道中山南路917号3楼202室5号会议室",
// introduction:
//   "<strong>传承创业精神，汇聚天下英才</strong><br/>" +
//   "<strong>心系为民服务，远见未来机遇</strong><br/>" +
//   "<strong>中田集团，品牌承载梦想</strong><br/>" +
//   " <br/>" +
//   "<strong>品牌寓意</strong><br/>" +
//   "<p>“中”代表中国，中庸</p>" +
//   "<p>“田”中四个口字组成 代表人丁兴旺</p>",
@withRouter
export default class MeetingDetail2 extends Component {
  state = {
    meetingInfo: null,
  };

  componentDidMount() {
    document.title = "会议详情";
  }

  render() {
    return (
      <div className="meeting-detail">
        {/* <div>
          <NavBar
            className="nav-bar"
            icon={<Icon type="left" />}
            leftContent="返回"
            onLeftClick={() => console.log("onLeftClick")}
          >
            会议详情
          </NavBar>
        </div> */}
        <div className="page">
          <Carousel autoplay={false} infinite>
            {this.state.images.map((image) => {
              return (
                <img
                  key={image}
                  src={`${image}`}
                  alt=""
                  style={{ width: "100%", verticalAlign: "top" }}
                />
              );
            })}
          </Carousel>
          <WhiteSpace size="lg" />
          <div className="main">
            <div className="title">{this.state.title}</div>
            <div className="m-time">
              <div className="start">
                <div className="time">{this.state.startTime}</div>
                <div className="date">{this.state.endDate}</div>
              </div>
              <div className="center">
                <div className="status">{this.state.status}</div>
                <div className="duration">
                  <div className="text">{this.state.duration}</div>
                </div>
                <div className="time-zone">(GMT+08:00)</div>
              </div>
              <div className="end">
                <div className="time">{this.state.endTime}</div>
                <div className="date">{this.state.endDate}</div>
              </div>
            </div>
            <div className="info">
              <div className="label">会议地址：</div>
              <div className="content">{this.state.address}</div>
            </div>
          </div>
          <WhiteSpace size="lg" />
          <div className="introduction">
            <div className="title">会议简介:</div>
            <div
              className="content"
              dangerouslySetInnerHTML={{ __html: this.state.introduction }}
            ></div>
          </div>
        </div>
        <div className="footer">
          <div className="btn">扫码签到</div>
        </div>
      </div>
    );
  }
}
